<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>添加/修改页面</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="../../../component/elementUI/index.css">
    <link rel="stylesheet" href="../../../component/pear/css/pear.css" />
    <link rel="stylesheet" href="../../../style/wangeditor.css">
    <link rel="stylesheet" href="../../../style/index.css">
</head>

<body>
    <div id="app" v-cloak>
        <div class="add">
            <div class="header">
                <span>{{(action == 'Add'?'添加':type =='0'?'修改':'查看')}}企业管理</span>
            </div>
            <div class="main" style="padding: 0 15px;">
                <!-- 配置属性, 目前仅支持 单主表 多子表 结构 -->

                <div id="form" :data-options="JSON.stringify({'tableName':'enterprise_info','formName':'dataForm' ,'primaryKey':'Enterprise_Info_SerialNumber'})">
                    <div :data-options="JSON.stringify({'tableName':'enterprise_history','formName':'childDataForm' ,'parentTableName':'enterprise_info'})">
                    </div>
                </div>
                <div class="table_titel">
                    <div class="titel">基本信息</div>
                </div>  

                <el-form :model="dataForm" ref="form" :inline-message="true" style="width: 100%">
                    <el-descriptions :column="2" size="large" border>    
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">企业编码</div>
                            </template>
                            <el-form-item prop="Enterprise_Info_SerialNumber" 
                                :rules="[{ required: true, message: '请输入企业编码', trigger: 'blur' }]">
                                <el-input :disabled="type=='1'" v-model.trim="dataForm.Enterprise_Info_SerialNumber" placeholder="请输入企业编码" />
                            </el-form-item>
                        </el-descriptions-item>
                        
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">企业名称</div>
                            </template>
                            <el-form-item prop="Enterprise_Name" :rules="[{ required: true, message: '请输入企业名称', trigger: 'blur' }]">
                                <el-input :disabled="type=='1'" v-model.trim="dataForm.Enterprise_Name" placeholder="请输入企业名称" />
                            </el-form-item>
                        </el-descriptions-item>

                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">企业Loge</div>
                            </template>
                            <el-form-item prop="Enterprise_Logo" :rules="[{ required: true, message: '请上传企业Loge', trigger: 'blur' }]">
                                <yl-upload :disabled="type=='1'" v-model="dataForm.Enterprise_Logo"></yl-upload>
                            </el-form-item>
                        </el-descriptions-item>
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">上传图片</div>
                            </template>
                            <el-form-item prop="Picture_URL" :rules="[{ required: true, message: '请上传图片', trigger: 'change' }]">
                                <yl-upload :disabled="type=='1'" v-model="dataForm.Picture_URL"></yl-upload>
                            </el-form-item>
                        </el-descriptions-item>
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">企业类型</div>
                            </template>
                            <el-form-item prop="Enterprise_Type" :rules="[{ required: true, message: '请输入企业类型', trigger: 'blur' }]">
                                <el-input :disabled="type=='1'" v-model.trim="dataForm.Enterprise_Type" placeholder="请输入企业类型" />
                            </el-form-item>
                        </el-descriptions-item>
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">（省-市-区）行政区编号</div>
                            </template>
                            <el-form-item prop="CountyNumber"
                                :rules="[{ required: true, message: '请选择行政区编号', trigger: 'change' }]">
                                <el-cascader @change="changeCity" :disabled="type=='1'" v-model.trim="dataForm.CountyNumber" filterable
                                    :props="{label:'name',value:'code',emitPath:false}" :options="city" clearable
                                    placeholder="请选择行政区编号" style="width: 100%;"></el-cascader>
                            </el-form-item>
                        </el-descriptions-item>
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">注册详细地址</div>
                            </template>       
                            <el-form-item prop="Detailed_Address" :rules="[{ required: true, message: '请输入注册详细信息', trigger: 'blur' }]">
                                <el-input :disabled="type=='1'" v-model.trim="dataForm.Detailed_Address" placeholder="请输入注册详细信息" />
                            </el-form-item>
                        </el-descriptions-item>
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">成立日期</div>
                            </template>
                            <el-form-item prop="Establish_Date">
                                <el-date-picker @change="handleDate($event,item)" :disabled="type=='1'" v-model.trim="dataForm.Establish_Date"
                                    format="yyyy-MM-dd" style="width: 100%;" value-format="yyyy-MM-dd" type="date"
                                    placeholder="可选择成立日期" size="large"></el-date-picker>
                            </el-form-item>
                        </el-descriptions-item>
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">法人代表</div>
                            </template>
                            <el-form-item prop="Legal_Person" :rules="[{ required: true, message: '请输入法人代表', trigger: 'blur' }]">
                                <el-input :disabled="type=='1'" v-model.trim="dataForm.Legal_Person" placeholder="请输入法人代表" />
                            </el-form-item>
                        </el-descriptions-item>
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">注册资本</div>
                            </template>
                            <el-form-item prop="Registered_Capital" :rules="[{ required: true, message: '请输入注册资本', trigger: 'blur' }]">
                                <el-input :disabled="type=='1'" v-model.trim="dataForm.Registered_Capital" placeholder="请输入注册资本" />
                            </el-form-item>
                        </el-descriptions-item>
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">联系电话</div>
                            </template>
                            <el-form-item prop="Contact_Telephone" :rules="[{ required: true, message: '请输入联系电话', trigger: 'blur' }]">
                                <el-input :disabled="type=='1'" v-model.trim="dataForm.Contact_Telephone" placeholder="请输入联系电话" />
                            </el-form-item>
                        </el-descriptions-item>
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">电子邮箱</div>
                            </template>
                            <el-form-item prop="E_mail" :rules="[{ required: true, message: '请输入电子邮箱', trigger: 'blur' }]">
                                <el-input :disabled="type=='1'" v-model.trim="dataForm.E_mail" placeholder="请输入电子邮箱" />
                            </el-form-item>
                        </el-descriptions-item>
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">联系人</div>
                            </template>
                            <el-form-item prop="Contact_Person" :rules="[{ required: true, message: '请输入联系人', trigger: 'blur' }]">
                                <el-input :disabled="type=='1'" v-model.trim="dataForm.Contact_Person" placeholder="请输入联系人" />
                            </el-form-item>
                        </el-descriptions-item>
                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">联系手机</div>
                            </template>
                            <el-form-item prop="Contact_Phone" :rules="[{ required: true, message: '请输入联系手机', trigger: 'blur' }]">
                                <el-input :disabled="type=='1'" v-model.trim="dataForm.Contact_Phone" placeholder="请输入联系手机" />
                            </el-form-item>
                        </el-descriptions-item>
                    </el-descriptions>
                </el-form>
                <div class="table_titel">
                    <div class="titel">历史记录</div>
                    <div class="operation"  v-if="type=='0'">
                        <el-button type="primary" size="small" @click="handleAdd('childDataForm')">新增</el-button>
                        <el-button type="danger" size="small" @click="handleRemove('childDataForm')">删除</el-button>
                    </div>
                </div>
                
                <el-form v-if="type=='0'" :model="{childDataForm:childDataForm.filter(i=>i.Row_Status != '1')}" ref="childForm"
                    :inline-message="true" style="width: 100%">
                    <el-descriptions :column="2" size="large" border
                        v-for="(item,index) in childDataForm.filter(i=>i.Row_Status != '1')" :key="index">
                  

                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">历史记录标题</div>
                            </template>
                            <el-form-item :prop="`childDataForm.${index}.Enterprise_History_Title`"
                                :rules="[{ required: true, message: '请输入记录标题', trigger: 'blur' }]">
                                <el-input v-model.trim="item.Enterprise_History_Title" placeholder="请输入记录标题"></el-input>
                            </el-form-item>
                        </el-descriptions-item>

                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">历史记录内容</div>
                            </template>
                            <el-form-item :prop="`childDataForm.${index}.Enterprise_History_Main`"
                                :rules="[{ required: true, message: '请输入记录内容', trigger: 'blur' }]">
                                <el-input v-model.trim="item.Enterprise_History_Main" placeholder="请输入记录内容"></el-input>
                            </el-form-item>
                        </el-descriptions-item>

                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">开始日期</div>
                            </template>
                            <el-form-item :prop="`childDataForm.${index}.Enterprise_Date`">
                                <el-date-picker @change="handleDate($event,item)" v-model.trim="item.Enterprise_Date"
                                    format="yyyy-MM-dd" style="width: 100%;" value-format="yyyy-MM-dd" type="date"
                                    placeholder="可选择开始日期" size="large"></el-date-picker>
                            </el-form-item>
                        </el-descriptions-item>

                        <el-descriptions-item>
                            <template slot="label">
                                <div class="cell-item">截至日期（非必填）</div>
                            </template>
                            <el-form-item :prop="`childDataForm.${index}.Enterprise_End_Date`">
                                <el-date-picker @change="handleDate($event,item)" v-model.trim="item.Enterprise_End_Date"
                                    format="yyyy-MM-dd" style="width: 100%;" value-format="yyyy-MM-dd" type="date"
                                    placeholder="可选择截至日期" size="large"></el-date-picker>
                            </el-form-item>
                        </el-descriptions-item>
                    </el-descriptions>
                </el-form>
            </div>

            <div class="footer">
                <el-button size="medium" @click="handleBack">返回</el-button>
                <el-button size="medium" type="primary" plain @click="handleSubmit" :loading="loading">提交</el-button>
            </div>
        </div>
    </div>

    <script type="text/javascript" src="../../../utils/wangeditor.js"></script>
    <script type="text/javascript" src="../../../utils/jquery.min.js"></script>
    <script type="text/javascript" src="../../../utils/jquery.cookie.js"></script>
    <script type="text/javascript" src="../../../utils/vue.min.js"></script>
    <script type="text/javascript" src="../../../utils/vuex.min.js"></script>
    <script type="text/javascript" src="../../../component/elementUI/index.js"></script>
    <script type="text/javascript" src="../../../utils/components.js"></script>
    <script type="text/javascript" src="../../../utils/compressor.js"></script>
    <script type="text/javascript" src="../../../utils/validity.js"></script>
    <script type="text/javascript" src="../../../utils/utils.js"></script>
    <script type="text/javascript" src="../../../utils/http.js"></script>
    <script type="text/javascript" src="js/add.js"></script>
</body>

</html>